<form *ngIf="isAdmin$|async" class="search-area">
  <span fxFlex></span>
  <button (click)="create()" mat-mini-fab tabindex="-1" type="button">
    <mat-icon>add</mat-icon>
  </button>
</form>

<mat-divider></mat-divider>

<mat-table [dataSource]="workshops$" fxFlex>
  <ng-container matColumnDef="corporation">
    <mat-header-cell *matHeaderCellDef>{{'corporation'|translate}}</mat-header-cell>
    <mat-cell *matCellDef="let row">{{row.corporation.name}}</mat-cell>
  </ng-container>

  <ng-container matColumnDef="name">
    <mat-header-cell *matHeaderCellDef>{{'Common.name'|translate}}</mat-header-cell>
    <mat-cell *matCellDef="let row">{{row.name}}</mat-cell>
  </ng-container>

  <ng-container matColumnDef="code">
    <mat-header-cell *matHeaderCellDef fxFlex="100px" fxLayoutAlign="center center">{{'CODE'|translate}}</mat-header-cell>
    <mat-cell *matCellDef="let row" fxFlex="100px" fxLayoutAlign="center center">{{row.code}}</mat-cell>
  </ng-container>

  <ng-container matColumnDef="sapT001ls">
    <mat-header-cell *matHeaderCellDef fxLayoutAlign="center center">{{'Workshop.sapT001ls'|translate}}</mat-header-cell>
    <mat-cell *matCellDef="let row" fxLayoutAlign="center center">
      <ng-container *ngTemplateOutlet="sapT001lsTemp;context:{sapT001ls:row.sapT001ls}"></ng-container>
    </mat-cell>
  </ng-container>

  <ng-container matColumnDef="sapT001lsPallet">
    <mat-header-cell *matHeaderCellDef fxLayoutAlign="center center">{{'Workshop.sapT001lsPallet'|translate}}</mat-header-cell>
    <mat-cell *matCellDef="let row" fxLayoutAlign="center center">
      <ng-container *ngTemplateOutlet="sapT001lsTemp;context:{sapT001ls:row.sapT001lsPallet}"></ng-container>
    </mat-cell>
  </ng-container>

  <ng-container matColumnDef="sapT001lsForeign">
    <mat-header-cell *matHeaderCellDef fxLayoutAlign="center center">{{'Workshop.sapT001lsForeign'|translate}}</mat-header-cell>
    <mat-cell *matCellDef="let row" fxLayoutAlign="center center">
      <ng-container *ngTemplateOutlet="sapT001lsTemp;context:{sapT001ls:row.sapT001lsForeign}"></ng-container>
    </mat-cell>
  </ng-container>

  <ng-container matColumnDef="btns">
    <mat-header-cell *matHeaderCellDef>{{'Common.operation'|translate}}</mat-header-cell>
    <mat-cell (click)="update(row)" *matCellDef="let row" matRipple>
      <mat-icon>edit</mat-icon>
    </mat-cell>
  </ng-container>

  <mat-header-row *matHeaderRowDef="displayedColumns$|async; sticky: true"></mat-header-row>
  <mat-row *matRowDef="let row; columns: displayedColumns$|async;"></mat-row>
</mat-table>

<ng-template #sapT001lsTemp let-sapT001ls="sapT001ls">
  <mat-list dense>
    <mat-list-item *ngFor="let it of sapT001ls;last as last">
      <div fxLayout fxLayoutGap="16px" matLine>
        <span>{{it.lgort}}</span>
        <span>{{it.lgobe}}</span>
      </div>
    </mat-list-item>
  </mat-list>
</ng-template>
